<template>
  <van-cell title="账号" :value="user.account"/>
  <van-cell title="用户名" is-link :value="user.username" @click="toEdit('username','用户名',user.username)"/>
  <van-cell title="邮箱" is-link :value="user.email"/>
  <van-cell title="性别" is-link :value="user.gender"/>
  <van-cell title="电话" is-link :value="user.phone"/>
  <van-cell title="头像" is-link>
    <img :src="user.avatarUrl" style="height: 64px">
  </van-cell>
  <van-cell title="标签" is-link :value="user.tags"/>
  <van-cell title="创建时间" is-link :value="user.createTime"/>
</template>

<script setup lang='ts'>
import { useRouter} from 'vue-router'
import {onMounted, ref} from "vue";
import {currentUser} from "../../services/api.ts";

const router = useRouter()
const user:API.User = ref({})

onMounted(async () => {
  const res = await currentUser()
  user.value = res.data;
})

// const userInfo: API.User = {
//   username: 'hhf',
//   avatarUrl: 'https://pic.code-nav.cn/user_avatar/1810201696292536322/thumbnail/xjSNF9Z4-pain.png',
//   email: '123@qq.com',
//   gender: '男',
//   phone: '110',
//   account: 'hanhuaifei',
//   tags: JSON.stringify(["Java", "Vue"]),
//   createTime: new Date().getTime()
// }

const toEdit = (editKey: string, editName: string, currentValue: string) => {
  router.push({
        path: "/user/edit",
        query: {
          editKey,
          editName,
          currentValue,
        }
      }
  )
}
</script>
<style scoped>

</style>